import { View } from "@tarojs/components"
import React from "react"
import "./index.scss"

export default function (props) {
  const { productPrice, show, otherPrice } = props
  const fixedProductPrice = productPrice ? Number(productPrice).toFixed(2) : "0.00"
  const getFixedPrice = value => {
    return value ? Number(value).toFixed(2) : "0.00"
  }
  const showClass = show === true ? "component-price-detail-show" : show === false ? "component-price-detail-hide" : ""
  return (
    <View className={`component-price-detail ${showClass}`}>
      <View className="price-row">
        <View className="price-row-label">商品费：</View>
        <View className="price-row-value">￥{getFixedPrice(fixedProductPrice)}</View>
      </View>
      {otherPrice &&
        otherPrice.map(item => {
          return (
            <View className="price-row" key={item.key}>
              <View className="price-row-label">{item.name}：</View>
              <View className="price-row-value">￥{getFixedPrice(item.value)}</View>
            </View>
          )
        })}
    </View>
  )
}
